<script setup lang="ts">
defineProps<{
  msg: string;
}>();

const getData = async () => {
  const response = await fetch("http://localhost:3000/record", {
    method: "GET",
    headers: {
      "Content-Type": "application/json",
    },
  });

  // 解析返回的 JSON 数据
  const result = await response.json();

  if (response.ok) {
    console.log("数据查询成功:", result.message);
    // 处理返回的数据
    console.log(result.data);
  } else {
    console.error("数据查询失败:", result.message);
  }
};

// 上传到服务器
const save = async () => {
  const body = {
    timestamp: String(Date.now()),
    events: [
      {
        time: 0,
        type: "start",
      },
      {
        time: 1000,
        type: "end",
      },
    ],
  };
  const response = await fetch("http://localhost:3000/record/saveRecording", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify(body),
  });

  // 解析返回的 JSON 数据
  const result = await response.json();

  if (response.ok) {
    console.log("保存成功:", result.message);
    // 处理返回的数据
    console.log(result.data);
  } else {
    console.error("保存失败:", result.message);
  }
};
</script>

<template>
  <div class="greetings">
    <div>{{ msg }}</div>
    <button :onclick="save">保存数据</button>
    <button :onclick="getData">获取数据</button>
  </div>
</template>

<style scoped></style>
